<template>
	<view>
		<MusicHeader title="colud用户登录" :icon="true" />
		<view class="loding">
			<image src="../../static/disc.png" mode=""></image>
			<input type="text" placeholder="请输入colud手机号" v-model="userId" />
			<input type="password" placeholder="请输入密码" v-model="passWord" />
			<button type="default" @tap="clickhandletoloding">登录</button>
		</view>
	</view>
</template>

<script>
	import '../../common/iconfont.css'
	import MusicHeader from "../../components/MusicHeader/MusicHeader.vue"
	import {
		topList
	} from '../../common/api.js'
	import {
		loding
	} from '../../common/api.js'
	export default {
		data() {
			return {
				userId: '',
				passWord: '',
				data: [],
				


			}
		},
		methods: {
			clickhandletoloding() {
				const id = this.userId;
				const pwd = this.passWord
				loding(id, pwd).then((res) => {
					this.data = res[1].data
					
					if (this.data.code < 400) {
						// #ifdef  H5
							this.$store.commit('INIT_USERMSG',res[1].data);
						// #endif
						
						// #ifdef MP-WEIXIN
							uni.showToast({
								title: "登录成功",
								mask:"true"
							})
							this.$store.commit('INIT_USERMSG',res[1].data);
						// #endif
						setTimeout(() => {
							uni.navigateTo({
								url: "../index/index"
							})
						}, 1500)
					} else if (this.data.code >= 400) {
						// #ifdef H5
							alert(this.data.msg || "该用户未注册")
						// #endif
						// #ifdef MP-WEIXIN
							uni.showToast({
								title: this.data.msg || "该用户未注册",
								icon: "error",
								mask:"true"
							})
						// #endif
					}
				})
			}
		}
	}
</script>

<style>
	.loding {
		margin: 0 30rpx;
	}

	.loding image {
		width: 145rpx;
		height: 145rpx;
		margin: 20rpx 280rpx;
	}

	.loding input {
		width: 500rpx;
		height: 100rpx;
		margin: 0 90rpx;
		padding-left: 20rpx;
		border-bottom: 2rpx solid #808080;
	}

	.loding button {
		margin-top: 50rpx;
		width: 500rpx;
		height: 70rpx;
		background-color: #fc3a3a;
		line-height: 70rpx;
		color: #FFFFFF
	}

	.loding view {
		width: 500rpx;
		height: 70rpx;
		color: red;
		text-align: center;
		font-size: 30rpx;
	}
</style>
